@use '@/styles/vars';
.homecontainer{
  width:100%;
  height:100vh;
  background-color:#FFFFFf;
  p,h3{
    margin:0;
  }
  .bannerbox,.chanpinbox,.jianguanbox,.shujubox{
    display: flex;
    flex-direction: column;
    width:100%;
    img{
      width:100%;
    }
  }
  .jianguanbox{
    background-image:url('./images/3.png');
    background-repeat: no-repeat;
    background-size: cover;
    height:100vh;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    >h3{
      width:375 * vars.$px;
      font-weight: 900;
      font-size: 40px;
      color: #E24737;
      text-align:center;
      font-style: normal;
      text-transform: none;
      margin:0 auto;
      padding-top:88px;
      // margin-top:186px;
      margin-bottom:44px;
    }
    >p{
      text-align: center;
      width:375 * vars.$px;
      margin:0 auto;
      font-weight: 400;
      font-size: 16px;
      color: #666666;
      line-height: 24px;
      text-align: center;
      font-style: normal;
      text-transform: none;

    }
    .jianguanlistbox{
      display: flex;
      flex-direction: row;
      align-items: center;
      justify-content: center;
      margin-top:60px;
      div{
        background-color:#fff;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        padding:20px;
        box-shadow: 0px 0px 43px 0px #eadfdf;
        img{
          width:180px;
          height:90px;
          margin:0 60px;
        }
        p:nth-child(2){
          font-weight: 400;
          font-size: 36px;
          color: #E24737;
          line-height: 36px;
          text-align: center;
          font-style: normal;
          text-transform: none;
          margin-top:20px;
          margin-bottom:20px;
        }
        p:nth-child(3){
          font-weight: 400;
          font-size: 16px;
          color: #666666;
          line-height: 24px;
          text-align: center;
          font-style: normal;
          text-transform: none;
          margin-top:0px;
          // margin-bottom:0;
        }
        p:nth-child(4){
          font-weight: 400;
          font-size: 16px;
          color: #666666;
          line-height: 24px;
          text-align: center;
          font-style: normal;
          text-transform: none;
          margin-top:30px;
        }
        p:nth-child(5){
          font-weight: 400;
          font-size: 16px;
          color: #666666;
          line-height: 24px;
          text-align: center;
          font-style: normal;
          text-transform: none;
          margin-top:30px;
        }
        p:nth-child(6){
          font-weight: 400;
          font-size: 16px;
          color: #666666;
          line-height: 24px;
          text-align: center;
          font-style: normal;
          text-transform: none;
          margin-top:20px;
        }
        p:nth-child(7){
          font-weight: 400;
          font-size: 16px;
          color: #666666;
          line-height: 24px;
          text-align: center;
          font-style: normal;
          text-transform: none;
          margin-top:20px;
        }
      }
      div:nth-child(2){
        margin:0 22px;
      }
    }
  }
  .shujubox{
    background-image:url('./images/4.png');
    background-repeat: no-repeat;
    background-size: cover;
    height:100vh;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    >h3{
      font-weight: 900;
      font-size: 40px;
      color: #E24737;
      text-align:center;
      font-style: normal;
      text-transform: none;
      width:375 * vars.$px;
      margin:0 auto;
      // margin-top:186px;
      margin-bottom:44px;
    }
    >p{
      text-align: center;
      width:375 * vars.$px;
      margin:0 auto;
      font-weight: 400;
      font-size: 16px;
      color: #666666;
      line-height: 24px;
      text-align: center;
      font-style: normal;
      text-transform: none;
    }
    .shujucardbox{
      width:375 * vars.$px;
      margin:0 auto;
      height:199px;
      background-color:#fff;
      border-radius:22px;
      margin-top:190px;
      display: flex;
      flex-direction: row;
      align-items: center;
      box-shadow: 0px 0px 43px 0px #eadfdf;
      >div:nth-child(1){
        margin-left:85px;
      }
      >div{
        flex:1;
        p{
          margin:0;
        }
        p:nth-child(1){
          font-weight: 900;
          font-size: 50px;
          color: #E24737;
          text-align: left;
          font-style: normal;
          text-transform: none;
          display: flex;
          flex-direction: row;
          align-items: baseline;
          justify-content: center;
          span{
            font-size:30px;
          }
        }
        p:nth-child(2){
          font-weight: 400;
          font-size: 18px;
          color: #666666;
          line-height: 24px;
          text-align:center;
          font-style: normal;
          text-transform: none;
          margin-top:17px;
        }
      }
    }
  }
  .chanpinbox{
    background-image:url('./images/2.png');
    background-repeat: no-repeat;
    background-size: cover;
    height:100vh;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    >div{
      h3{
        font-weight: 900;
        font-size: 40px;
        color: #E24737;
        text-align:center;
        font-style: normal;
        text-transform: none;
        margin:0;
        margin-top:162px;
        margin-bottom:44px;
      }
      p{
        width:375 * vars.$px;
        text-align: center;
        margin:0 auto;
        font-weight: 400;
        font-size: 16px;
        color: #666666;
        line-height: 24px;
        text-align: center;
        font-style: normal;
        text-transform: none;
      }
      .tabbox{
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: center;
        margin-top:71px;
        >div{
          width: 260px;
          height: 78px;
          background: #FFFFFF;
          border-radius: 22px 22px 22px 22px;
          margin-left:72px;
          box-sizing: content-box;
          display: flex;
          flex-direction: row;
          align-items: center;
          justify-content: center;
          font-weight: 400;
          font-size: 24px;
          color: #4E0D0F;
          cursor: pointer;
        }
        >div:first-child{
          margin-left:0;
        }
        .tabactive{
          border: 1px solid #E25748;
          box-sizing: border-box;
          color:#E24737;
        }
      }
    }
    .tablebox{
      background-color:#fff;
      width:375 * vars.$px;
      margin:0 auto;
      margin-top:60px;
      box-shadow: 0px 0px 43px 0px #f2f2f2;
      border-radius:22px;
      padding-top:20px;
      table{
        width:100%;

        img{
          width:54px;
          height:54px;
        }

        td{
          height:100px;
          text-align: center;
          font-weight: 400;
          font-size: 24px;
          color: #666666;
          line-height: 24px;
          font-style: normal;
          text-transform: none;
          div{
            display: flex;
            flex-direction: row;
            align-items: center;
            padding-left:50px;

            span{
              margin-left:30px;
              font-weight: 400;
              font-size: 24px;
              color: #000000;
              line-height: 24px;
              text-align: left;
              font-style: normal;
              text-transform: none;
            }
          }
        }
        th{
          font-weight: 400;
          font-size: 16px;
          color: #666666;
          line-height: 40px;
          font-style: normal;
          text-transform: none;
          text-align: center;
        }
        button{
          width: 136px;
          height: 32px;
          background: #FFFFFF;
          border: 1px solid #95724D;
          font-weight: 400;
          font-size: 16px;
          color: #95724D;
          line-height: 24px;
          text-align:center;
          font-style: normal;
          text-transform: none;
          cursor: pointer;
        }
        tr{
          td:nth-child(5){
            text-align: right;
            padding-right:50px;
          }
        }
      }
    }
  }
  .lunbobox{
    width:100%;
    overflow: hidden;
    height:calc(100vh - 88px);
    background-image: url('./images/1.jpg');
    background-repeat: no-repeat;
    background-size: cover;
    margin-top:88px;
  }
  .bannerbox{
    background-image: url('./images/1.jpg');
    background-repeat: no-repeat;
    background-size: cover;
    height:100%;
  }
  :deep(.el-carousel__indicators--outside){
    position: absolute;
    bottom:100px;
  }
  .jianguantitlebox{
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    height:100vh;
    h3{
      font-weight: 900;
      font-size: 40px;
      color: #E24737;
      text-align:center;
      font-style: normal;
      text-transform: none;
      margin:0;
      margin-top:64px;
      margin-bottom:44px;
    }
    p{
      text-align: center;
      margin:0;
      font-weight: 400;
      font-size: 16px;
      color: #666666;
      line-height: 24px;
      text-align: center;
      font-style: normal;
      text-transform: none;
    }
  }

  .jiaoyixitongbox{
    background-image: url('./images/jt@2x.png');
    background-repeat: no-repeat;
    background-position: center bottom;
    background-size: 752px 794px;
    background-color:#f9f9f9;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    h3{
      font-weight: 900;
      font-size: 40px;
      color: #E24737;
      text-align:center;
      font-style: normal;
      text-transform: none;
      margin:0;
      padding-top:220px;
    }
    h3:nth-child(2){
      margin-bottom:48px;
    }
    p{
      text-align: center;
      margin:0;
      font-weight: 400;
      font-size: 16px;
      color: #666666;
      line-height: 24px;
      text-align: center;
      font-style: normal;
      text-transform: none;
    }
    .jiaoyixitonglistgroup{
      width:375 * vars.$px;
      margin:0 auto;
      margin-top:318px;
      padding-bottom:120px;
      ul{
        list-style: none;
        margin:0;
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: center;
        gap:60px;
        
        li{
          width: 260px;
          height: 123px;
          background: #FFFFFF;
          border-radius: 22px 22px 22px 22px;
          display: flex;
          flex-direction: column;
          align-items: center;
          justify-content: center;
          box-shadow: 0px 0px 43px 0px #eadfdf;

          p:nth-child(1){
            font-weight: 900;
            font-size: 47px;
            color: #BB9B73;
            text-align: center;
            font-style: normal;
            text-transform: none;
            line-height:47px;
            display: flex;
            flex-direction: row;
            align-items: baseline;
            span{
              font-size:26.37px;
            }
          }
          p:nth-child(2){
            font-weight: 400;
            font-size: 16px;
            color: #666666;
            line-height: 24px;
            text-align: center;
            font-style: normal;
            text-transform: none;
          }
        }
      }
    }
  }
  .hezuobox{
    width:100%;
    margin:0 auto;
    background-image: url('./images/ditu@2x.png');
    background-repeat: no-repeat;
    background-size:cover;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding-bottom:100px;

    h3{
      font-weight: 900;
      font-size: 40px;
      color: #E24737;
      text-align:center;
      font-style: normal;
      text-transform: none;
      width:375 * vars.$px;
      margin:0 auto;
      padding-top:130px;
    }
    p{
      text-align: center;
      width:375 * vars.$px;
      margin:0 auto;
      font-weight: 400;
      font-size: 16px;
      color: #666666;
      line-height: 24px;
      text-align: center;
      font-style: normal;
      text-transform: none;
    }

    .logoscard{
      background-color:#fff;
      width:375 * vars.$px;
      margin:0 auto;
      padding:20px 0;
      margin-top:63px;
      box-shadow: 0px 0px 43px 0px #eadfdf;

      .logositemcard{
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: space-around;
        margin-bottom:63px;

        div{
          width:152px;
          height: 42px;

          img{
            width:152px;
            height: 42px;
          }
        }
      }

      .logositemcard:last-child{
        margin-bottom:0;
      }
    }
  }

  .footerbox{
    width:100%;
    height:100vh;
    background-color:#E24737;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-end;
  }
}

:deep(.fp-watermark){
  display: none!important;
}
.statisticbox{
  display: flex;
  flex-direction: row;
  align-items:flex-end;
  :ddep(.el-statistic){
    .el-statistic__content{
      .el-statistic__content{
        font-weight: 900;
        font-size: 50px;
        color: #E24737;
        text-align: left;
        font-style: normal;
        text-transform: none;
      }
    }
    
  }
  
}